<template>
	<view class="shopping">
		<!-- <view class="header-top" :style="{height: top+'px'}">

		</view>
		<view class="header-zhong" :style="{height: top+'px'}"> 
			
		</view> -->
		<!-- <view class="header-line" >

			<view class="right" style="text-align: center;">
				<view class="search">
					商城
				</view>
			</view>

		</view> -->
		<!-- <view class="box" :style="{height:'10'+'px'}">

		</view> -->
		<u-popup class="van-popup" :show="succesDialogshow" :overlay="false" position="bottom">
			<view class="popup_box">
				<u-icon class="icon" name="close-circle" @click="changeicon"></u-icon>
				<view class="popup_box_tian">
					<view class="popup_box_a">
						<image class="img" :src="storeInfo.image"></image>
						<view>
							<text class="text" style="padding: 0 10rpx;font-size: 24rpx;">{{storeInfo.storeName}}</text>
							<text class="text1">￥
								<text class="text2">{{storeInfo.price}}</text>
							</text>
						</view>
					</view>
				</view>
				<view class="goumai">
					<view class="goumai_left">
						<!-- <text class="text1">购买数量</text>
						<text class="text2">(有货)</text> -->
					</view>
					<view class="goumai_right">
						<!-- <text class="text3" @click="numjian">-</text>
						<text class="text4">{{num}}</text>
						<text class="text5" @click="numjia">+</text> -->
					</view>
				</view>
			</view>

			<view class="bottoms">
				<view class="bottom_left" @click="gouwuccc">
					<image src="../../static/imgs/gwc.png"></image>
					<text>购物车</text>
				</view>
				<view class="gouwuche" @click="goCart">
					加入购物车
				</view>
				<view class="bottom_right" @click="gobuy()">
					立即购买
				</view>
			</view>
		</u-popup>
		<view class="shopping_box">
			<view class="shopping_box_left">

				<image class="icon" src="../../static/images/sousuo.png"></image>
				<input class="ipt" type="text" placeholder="请输入搜索内容" @input="shopinput" :value="value">
				<button class="btn" @click="shopsearch">搜索</button>
				<image class="img" src="../../static/img/gwc.png" @click="image"></image>
			</view>
		</view>
		<view class="shopping_box_shangpin">
			<view class="shopping_box_shangpin_shang">
				<view class="shopping_box_shangpin_tab">
					<scroll-view class="scroll-view" scroll-x="true">
						<text @click="handclick(item,index)" v-for="(item,index) in lists2"
							:class="index==n ? 'active':''" :key="item.id">{{item.cateName}}</text>
					</scroll-view>


				</view>
				<view class="shopping_box_shangpin_yangshi">
					<view class="shopping_box_quanbu_a">
						<view class="shopping_box_quanbu_left" v-for="it in shoppinglist" :key="it.id">
							<view class="shopping_box_quanbu_img" @click="commoditydetails(it.id,it.cateId)">
								<image class="img" :src="it.image" mode="aspectFill"></image>
							</view>
							<view class="shopping_box_quanbu_zhong">{{it.storeName}}</view>
							<view class="shopping_box_quanbu_bottom">
								<view class="shopping_box_quanbu_bottom_left">
									<text class="text1">￥</text>
									<text class="text2">{{it.price}}</text>
								</view>
								<text class="btn" @click="purchase(it.id)">购买</text>
								<view class="gouwu" @click="shoppingtrolley(it.id)">
									<u-icon class="icon" size="20" color="#fff" name="shopping-cart" />
									</u-icon>
								</view>
							</view>
						</view>
						<view v-if="isshow" style="text-align: center;margin-top: 160rpx;">
							<image src="../../static/iconShow/noOrder.png"></image>
						</view>
					</view>

					<!-- <view >4</view> -->
				</view>
			</view>
			<view class="shopping_box_quanbu">

			</view>
		</view>
	</view>
</template>

<script>
	import homeServices from '../../service/homeService'
	export default {
		data() {
			return {
				value: '',
				// right: '',
				// padding: '',
				// top: '',
				// height: '',
				actives: true,
				n: 0,
				ids: 0,
				ids1: 0,
				lists: [],
				lists2: [],
				shoppinglist: [],
				arr: [],
				list: [],
				num: 1,
				shoplist: [],
				type: '3',
				succesDialogshow: false,
				objitem: {},
				storeInfo: {},
				productValue: {},
				iddd: '',
				isshow: false

			}
		},
		onLoad(option) {
			uni.setStorageSync("historyId", 3)
			
			this.getshoppinglist()
			uni.setStorageSync('unique', this.productValue.unique)
			uni.showTabBar()
			let a = uni.getStorageSync("historyId")
			console.log(a)
			if (a) {
				this.type = a
			}
			this.gethome(this.type)
		},

		onShow() {
			
			uni.showTabBar()

		},
		methods: {
			async getshoppinglist() {

				let res = await homeServices.getshoppinglist()
				this.lists = res.data
				console.log(this.lists)
				this.lists.forEach((item) => {
					if (item.children) {
						item.children.forEach((it) => {
							if (it.pid == 1) {
								this.lists2.push(it)
							}
						})

					}

				})
				// console.log(this.lists, this.lists2, '初始化')
			},
			async handclick(item, index) {
				this.ids = item.id;
				this.n = index
				let params = {
					sid: this.ids
				}
				let res = await homeServices.handclick(params)
				// console.log(res)
				this.shoppinglist = res.data
				if (this.shoppinglist.length == 0) {
					this.isshow = true
				} else {
					this.isshow = false
				}
				console.log(this.shoppinglist, 'shoplist')
			},
			async gethome(e) {
				console.log(e)
				let params = {
					sid: e
				}
				let res = await homeServices.handclick(params)
				this.shoppinglist = res.data

			},
			// 搜索
			async shopsearch() {
				let params = {
					keyword: this.value
				}
				let res = await homeServices.shopsearch(params)
				this.shoppinglist = res.data

			},
			shopinput(e) {
				console.log(e)
				this.value = e.detail.value
				if (this.value == '') {
					this.gethome(this.type)
				}
			},
			async purchase(id) {
				uni.setStorageSync('iddd', id)
				uni.setStorageSync('addressId', '0')
				let res = await homeServices.commoditydetails(id)
				this.storeInfo = res.data.storeInfo
				if (res.data.productValue) {
					for (const key in res.data.productValue) {
						//单规格					
						if (this.storeInfo.specType == '0') {
							this.productValue = res.data.productValue[key]
							console.log(this.productValue)
						}
					}

				}
				let params = {
					cartNum: this.num,
					uniqueId: this.productValue.unique,
					productId: this.productValue.productId,
					new: 1
				}

				let res1 = await homeServices.shoppurchase(params)

				if (res1) {
					let cartId = res1.data.cartId
					uni.setStorageSync('cartId', cartId)
					uni.navigateTo({
						url: '/pagesA/purchase/purchase?cartIds=' + cartId
					})
				}
			},
			image() {
				uni.navigateTo({
					url: '/pagesA/shoppingtrolley/shoppingtrolley'
				})
			},


			async shoppingtrolley(id) {
				this.iddd = id
				uni.setStorageSync('iddd', this.iddd)
				this.succesDialogshow = true
				uni.hideTabBar()
				let res = await homeServices.commoditydetails(id)
				this.storeInfo = res.data.storeInfo
				if (res.data.productValue) {
					for (const key in res.data.productValue) {
						//单规格
						// console.log(this.storeInfo,'jjjjjj')
						if (this.storeInfo.specType == '0') {
							// console.log(res.data.productValue[key],'44444')
							this.productValue = res.data.productValue[key]
							// this.productValue
							// console.log(this.productValue,'nnnnnn')
							// uni.setStorageSync('unique', this.productValue.unique)
						}
					}

				}


				// console.log(this.productValue, '9999999999')

			},
			changeicon() {
				this.succesDialogshow = false
				uni.showTabBar()
			},
			async commoditydetails(id, cateId) {
				console.log(id, 'kkkkkkkkkkkkk')
				this.ids1 = id
				let params = {
					ids: this.ids1
				}
				let res = await homeServices.handclick(params)
				// let item = res.data.find(it => it.id == id)
				// let type = item.cateId
				uni.setStorageSync("historyId", cateId)
				uni.navigateTo({
					url: `/pagesA/commoditydetails/commoditydetails?id=${id}`
				})
			},
			numjian() {
				if (this.num <= 1) {
					return false
				}
				this.num--
			},
			numjia() {

				this.num++

			},

			// 购物车
			async goCart() {
				let params = {
					cartNum: this.num,
					uniqueId: this.productValue.unique,
					productId: this.productValue.productId
				}
				let res = await homeServices.shoppurchase(params)
				console.log(res, 8888888)
				if(res.status==200){
					uni.showToast({
						title: res.msg,
						icon: 'none'
					});
					this.succesDialogshow = false
					uni.showTabBar()
					uni.setStorageSync('cardId', res.data.cartId)
				}
				
			},
			gouwuccc() {
				uni.showTabBar()
				uni.navigateTo({
					url: '/pagesA/shoppingtrolley/shoppingtrolley'
				})

				this.succesDialogshow = false

			},
			// 立即购买
			async gobuy() {
				uni.setStorageSync('addressId', '0')
				let params = {
					cartNum: 1,
					uniqueId: this.productValue.unique,
					productId: this.productValue.productId,
					new: 1
				}
				let res = await homeServices.shoppurchase(params)
				console.log(res, '购物车里立即购买')
				uni.setStorageSync('cartId', res.data.cartId)
				uni.navigateTo({
					url: `/pagesA/purchase/purchase?ids=${this.iddd}`
				})
				this.succesDialogshow = false
			}




		}
	}
</script>

<style lang="scss" scoped>
	@import '@/static/sass/shopping.scss'
</style>
